<template>
    <div class="shopNotice">
        <el-steps class="steps" :active="active" finish-status="success">
            <el-step title="申请开店"></el-step>
            <el-step title="开店须知"></el-step>
            <el-step title="店铺信息"></el-step>
            <el-step title="平台审核"></el-step>
            <el-step title="在线签约"></el-step>
        </el-steps>
        <div class="info">
            <div class="xy"><span  >请仔细阅读以下商家入驻服务协议及规则</span></div>
            <el-collapse v-model="activeNames">
                <el-collapse-item class="title" title='用户使用"商家在线入驻系统"前请认真阅读并理解本协议内容，本协议内容中以加粗方式显著标识的条款，请用户着重阅读、慎重考虑' name="1">
                    <div class="text" style="text-indent: 4em">
                        <span >甲方因开展网上商务活动需要，与乙方合作，甲、乙双方本着自愿、平等、公平、诚实、信用的原则，经友好协商，根据中华人民共和国有关法律、法规的规定签订本协议，由双方共同遵守。</span><br>
                        <span style="font-weight: bold"> 第一条  合作方式</span><br>
                        1.1  乙方负责“抖兴商城”的整体宣传和推广。<br>
                        1.2  如因产品质量、货不对版、物流损坏等非不可抗力因素，导致买家就货物问题投诉至乙方的，甲方必须按照乙方商城的规则退换货物或退还货款给买家，如拒绝履行的，乙方有权视情节轻重提前终止本协议，并保留追究民事赔偿的权利。<br>
                        <span style="font-weight: bold">第二条  注意事项</span><br>
                        2.1  无论在何种情况下，甲方均承诺对其销售的产品负责，不得经营国家明令禁止及法律法规不允许通过网络进行销售的任何产品。<br>
                        2.2  甲方对于在“抖兴商城”中用于展示、销售、宣传、推广的任何关于产品信息的文字、图片、视频等数字材料负有不可推卸的责任。<br>
                        2.3  “抖兴商城”及其所有权为乙方所有，甲方不得在没有取得乙方授权、或在乙方不知情的情况下，盗用、复制乙方平台数据。在没有得到书面授权的情况下，不得使用“抖兴商城”的任何标识、图片、文字、视频等用于商业活动。<br>
                        <span style="font-weight: bold">第三条  甲乙双方的权利与义务</span><br>
                        <span style="font-weight: bold">3.1  甲方的权利</span><br>
                        3.1.1 甲方有权根据自身具体情况在与乙方协商后变更陈列产品的图片、种类、数量及描述。<br>
                        3.1.2 甲方有权就乙方客户服务及平台系统功能提出建议。<br>
                        <span style="font-weight: bold">3.2  甲方的义务</span><br>
                        3.2.1 应及时向乙方提供所售商品的图片和文字介绍，经常与乙方联系更新商品及服务信息，并保证信息的合法、真实及准确；甲方商品及其他重要信息如有变动应当立即通知乙方。<br>
                        3.2.2甲方在乙方平台上进行销售、商务活动应当出具或提供必要的票据或由双方协商解决。<br>
                        3.2.3甲方应保守乙方的商业秘密。本协议依法终止后，甲方仍有义务保守乙方的商业、技术情报、资料秘密。本保密条款不因协议的终止、失效而无效。<br>
                        3.2.4 甲方应遵守乙方适时发布的商城规则、以及相关法律法规的规定。<br>
                        <span style="font-weight: bold">3.3  乙方的权利</span><br>
                        3.3.1乙方所针对甲方产品所设计制作的、且在网上发布的所有网页、网上内容等版权归乙方所有。<br>
                        3.3.2如甲方在日常经营中违反国家法律法规的，乙方有权终止本协议。<br>
                        3.3.3甲方如在经营过程中违反乙方平台公布的相关规定，乙方有权根据相关规定内容，对甲方进行停止商城店铺使用权等。<br>
                        3.3.4乙方保留因“抖兴商城”发展需要，在不影响甲方权益的情况下对“抖兴商城”的任何公共部分进行重新规划和调整的权利。<br>
                        <span style="font-weight: bold">3.4  乙方的义务</span><br>
                        3.4.1乙方应当在协议生效且甲方已完整提供所需资料信息后一周内交付甲方商城店铺。<br>
                        3.4.2乙方保证在推广甲方产品和推广甲方商城店铺的过程中不对甲方其他销售平台及产品进行任何侵权。<br>
                        3.4.3乙方应保守甲方的商业秘密。本协议依法终止后，乙方仍有义务保守甲方的商业、技术情报、资料秘密。本保密条款不因协议的终止、失效而无效。<br>
                        3.4.4 乙方应加强商城的系统维护，确保商城持续正常运行。<br>
                        <span style="font-weight: bold"> 第四条  甲乙双方，不论哪方认为对方违反了本协议的任一条款，可向对方发出口头或书面通知，对方自收到通知15天内，
                            应给予书面答复并采取补救措施。如果对方不予答复或没有采取补救措施的，则视为对方违约，发出通知方有权选择终止本协议或继续履行本协议。
                            但无论守约方作出何种选择，违约方均应赔偿守约方的实际损失。</span><br>
                        <span style="font-weight: bold">第五条  对于在履行本协议过程中引发的争议，由甲乙双方协商解决；如果协商不成，向乙方所在地的人民法院起诉。</span><br>
                        <span style="font-weight: bold">第六条  在本协议执行过程中，如果出现了不可抗力事件，并在事实上影响本协议的正常履行时，
                            受不可抗力情况影响的一方应尽快将情况通知对方，并尽快将有关的必要证明文件提交对方确认；因不可抗力造成的对履行本协议延误或无法正常履行时，
                            受不可抗力影响的一方不负法律责任。</span><br>
                        <span style="font-weight: bold">第七条  其他</span><br>
                        7.1  乙方抖兴商城已经发布或将来可能发布的各类规则均构成本协议的组成部分，与本协议具有同等法律效力。<br>
                        7.2  甲方注册成功并点击开店即表示甲方已充分阅读、理解并同意接受本协议的条款和条件。<br>
                    </div>
                </el-collapse-item>
            </el-collapse>
        </div>
        <el-dialog
                title="用户须知"
                :visible.sync="dialogVisible1"
                width="30%"
                >
            <span>请用户在使用"商家在线入驻系统"之前，请仔细阅读下文中的协议内容</span>
            <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="dialogVisible1 = false">确 定</el-button>
  </span>
        </el-dialog>
        <div>
            <el-checkbox class="checked" v-model="ischecked">我已阅读并且同意以上服务协议文本</el-checkbox>
        </div>
        <div class="btn">
            <el-button class="btn2" type="success" plain round  @click="turn()" >下一步</el-button>
        </div>
        <div class="img"><img src="./img/delAudit.jpg" @click="dialogVisible = true" style="width: 80px;float:right"></div>
        <el-dialog
                title="正在操作撤销店铺入驻申请"
                :visible.sync="dialogVisible"
                width="30%"
                :before-close="handleClose">
            <span>用户编号:<input style="height: 20px" v-model ="userCode" ></span><br>
            <span>身份证号:<input style="height: 20px;margin-top: 10px" v-model ="userCard" ></span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="delShop()">确 定</el-button>
              </span>
        </el-dialog>
    </div>
</template>

<style scoped>
    .shopNotice{
        width: 800px;
        margin: 0 auto;
    }
    .img{
        position: fixed;
        top: 390px;
        right: 0;
    }
    .info{
        margin-top: 30px;
        font-weight: bold
    }
    .checked{
        margin-top: 10px;
    }
    .xy{
        margin-bottom: 20px;
    }
    .btn{
        text-align: center;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .btn2{
        width: 200px;
    }
    .steps{
        margin-top: 20px;
    }
    .text{
      font-weight:normal
    }
</style>

<script>
    import {delShop} from '@/api/shop'
    export default {
        data() {
            return {
                userCard:null,
                userCode:null,
                active: 1,
                activeNames:['1'],
                ischecked: false,
                dialogVisible: false,
                dialogVisible1:false
            }
        },
        created() {
            this.isDialogVisible()
        },
        methods:{
            delShop(){
                this.$confirm('是否确认撤销店铺入驻申请？')
                    .then(_ => {
                        if (this.userCode == null || this.userCode == ''){
                            this.$message.error("请输入用户编号");
                            return
                        }
                        if (this.userCard == null || this.userCard == ''){
                            this.$message.error("请输入用户身份证号码");
                            return
                        }
                        delShop(this.userCode,this.userCard).then(res =>{
                            if (res.code == 10000){
                                this.$message.success("撤销入驻申请成功")
                                this.dialogVisible = false;
                            }else {
                                this.$message.error("撤销入驻申请失败")
                            }
                        })
                    })
                    .catch(_ => {});

            },
            handleClose(done) {
                this.$confirm('确认关闭？')
                    .then(_ => {
                        done();
                    })
                    .catch(_ => {});
            },
            isDialogVisible(){
                this.dialogVisible1 =true;
            },
            turn(){
                if (!this.ischecked){
                    this.$alert('请勾选服务协议', {
                        confirmButtonText: '确定',
                        callback: action => {
                        }
                    })
                    return;
                }
                if (this.ischecked){
                    this.$router.push({name: 'shopAudit',params:{}})
                }
            }
        }
    }
</script>
